<template>
    <div>
        <h3>权益显示列表</h3>
        <br>
        <a href="/addand">等级添加</a>
        
        <table class="table">
            <thead>
                <tr>
                    <th>权益编号</th>
                    <th>权益名称</th>
                    <th>权益说明</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody v-for="d in data">
                <tr>
                    <td>{{d.aid}}</td>
                    <td>{{d.aname}}</td>
                    <td>{{d.sum}}</td>
                    <td>{{d.state?"启用":"禁用"}}</td>
                    <td>
                        
                        <input type="button" :value='d.state?"禁用":"启用"' @click="states(d.aid)" class="btn btn-success">
                        <input type="button" value="删除" @click="delept(d.aid)" class="btn btn-success">
                        <input type="button" value="修改" @click="updet(d.aid)" class="btn btn-success">
                        
                    </td>

                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router';
const router=useRouter();
const route=useRoute();


const updet=(val:any)=>{
    router.push({path:"/updateand",query:{id:val}})
}

const states=(val:any)=>{

    axios.get("https://localhost:7237/api/Deng/Stateand",{params:{id:val}}).then(res=>{
        if(res.data>0){
            alert('状态修改成功!')
            showadd()
        }
        else{
            alert('状态修改失败!')
        }
    })
}

const delept=(val:any)=>{
    if(!confirm("确定要删除吗???")){
        return
    }
    axios.delete("https://localhost:7237/api/Deng/Rome",{params:{id:val}}).then(res=>{
    if(res.data>0){
        alert('删除成功!')
        showadd()
    }
    else{
        alert('删除失败!')
    }
})
}

const data=ref([{
    "aid": 0,
  "aname": "",
  "sum": "",
  "state": true
}])




const showadd=()=>{
    axios.get("https://localhost:7237/api/Deng/Showand").then(res=>{
        data.value=res.data;
    })
}

onMounted(()=>{
    showadd()

})

</script>

<style scoped>

</style>